﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ucIndexOnline.ascx.cs"
    Inherits="ExpertMIS.UserControl.ucIndexOnline" %>
<style type="text/css">
    .text_unfocus
    {
        color: #595959;
    }
    .text_focus
    {
        color: Black;
    }
    #onlineIndex
    {
        position:relative;
    }
    #onlineIndexView
    {
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        z-index: 9999;
        background-color: White;
    }
</style>

<script type="text/javascript">
    var defaultPropmpt = "填写其它意见";
    var viewSeed = Math.random();
    function doFocus(obj) {
        $(obj).removeClass('text_unfocus');
        $(obj).addClass('text_focus');
        if ($(obj).val() === defaultPropmpt) {
            $(obj).val("");
            $("input[type='radio'][name='option']").attr('checked', false);
        }
    }
    function doBlur(obj) {
        $(obj).removeClass('text_focus');
        $(obj).addClass('text_unfocus');

        if ($(obj).val() === "") {
            $(obj).val(defaultPropmpt);
            $("input[type='radio'][name='option']:first").attr('checked', true);
        }
    }
    function doSubmit() {
        var option = "";
        $("input[type='radio'][name='option']").each(function() {
            if ($(this).attr('checked')) {
                option = $(this).attr("value");
            }
        });
        if (option === "") option = $("#otherOpinion").val();
        $.post("Service/OnlineIndexService.ashx",
            { action: "poll", option: option },
            function(data) {
                if (data.success) alert("感谢您的投票！");
            },
            'json');
    }
    function viewOption() {
        if ($("#onlineIndexView").length <= 0) {
            $('#onlineIndex').append("<div id='onlineIndexView' ></div>");
            $.get("Service/OnlineIndexService.ashx",
               { action: "view", tmp: Math.random(viewSeed * 100) },
                function(data) {
                    $("#onlineIndexView").append(data);
                },
                'html');

            $("#onlineIndexView").show();
            setTimeout(function() { $("#onlineIndexView").fadeOut(2000) }, 8000);
        }
        else {
            $("#onlineIndexView").show(200);
            setTimeout(function() { $("#onlineIndexView").fadeOut(2000) }, 8000);
        }
    }
</script>

<div style="width: 231px; height: 215px; text-align: left;" id="onlineIndex">
    <div style="height: 24px; line-height: 24px; vertical-align: middle;">
        <span style="color: #595959; font-family: 宋体; font-size: 10pt; font-weight: bold;">您对我们网站的意见</span>
    </div>
    <div style="background-color: White; height: 154px;">
        <div style="font-size: 9pt;">
            <input type="radio" checked="checked" value="1" name="option" />一般
        </div>
        <div style="font-size: 9pt;">
            <input type="radio" value="2" name="option" />很好
        </div>
        <div style="font-size: 9pt;">
            <input type="radio" value="3" name="option" />非常好
        </div>
        <div style="font-size: 9pt; height: 80px;text-align:center;">
            <textarea class="text_unfocus" rows="2" style="width: 220px; border: #595959 1px solid;
                overflow: hidden; height: 80px;" onfocus="doFocus(this);" onblur="doBlur(this);"
                id="otherOpinion">填写其它意见</textarea>
        </div>
    </div>
    <div style="height: 32px; clear: both;">
        <table>
            <tr>
                <td style="width: 118px; text-align: center;">
                    <input type="button" value="提交" style="width: 70px; border: #595959 1px solid;" onclick="doSubmit();" />
                </td>
                <td style="width: 118px; text-align: center;">
                    <input type="button" value="查看" style="width: 70px; border: #595959 1px solid;" onclick="viewOption();" />
                </td>
            </tr>
        </table>
    </div>
</div>
